<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>传递一个实际的number类型的数据</title>
    <script src="vue.js"></script>
  </head>
  <body>
    <!-- 传递了一个字符串 "123" -->
    <div id="example">
      <app-parent></app-parent>
    </div>
    <script>
      var childNode = {
        template: "<div>{{ appPara }}的数据类型是{{ type }}</div>",
        props: ["appPara"],
        computed: {
          type() {
            return typeof this.appPara;
          },
        },
      };
      var parentNode = {
        template: `
  <div>
      <app-child :app-para="123"></app-child>
  </div>`,
        components: {
          appChild: childNode,
        },
      };
      // 创建根实例
      var vm = new Vue({
        el: "#example",
        components: {
          appParent: parentNode,
        },
      });
    </script>
  </body>
</html>
